<template>
	<div>
		<div class="app-container">
			<TopInfo />
			<Search :lookup="data.lookup" @investigate="inves" :date="data.dates" />
		</div>
		<div class="app-container" v-loading="data.status_top">
			<!-- 概况 -->
			<salestop :item="data.info" />
		</div>
		<div class="app-container" v-loading="data.mtloading">
			<!-- 统计 -->
			<div class="border border-[#4B8DF8] mt-6">
				<div class="bg-[#4B8DF8] text-[#fafafa] text-base p-2 flex flex-wrap">
					<div class="w-1/2 pl-2">{{ $t('report.sales.Statistical') }}</div>
					<div class="w-1/2 text-right pr-2">{{ $t('report.sales.Lasttime') }} ( {{
						getPlevel.gettime(data.listtime, 3) }} )</div>
				</div>
				<div class="m-2">
					<div class="mb-2 text-right" v-prmis="'sale_orders_exportReport'">
						<el-button type="primary" @click="getspread">{{ $t('public.export') }} Excel</el-button>
					</div>
					<el-table :data="data.list" :header-cell-style="{ 'text-align': 'center' }"
						:cell-style="{ 'text-align': 'center' }" class="w-full"
						:default-sort="{ prop: 'countDate', order: 'descending' }">
						<el-table-column prop="countDate" :label="$t('public.date')" sortable />
						<el-table-column prop="totalPrice" :label="$t('report.sales.machineSales')">
							<template #default="scope">
								{{ scope.row.totalPrice * 1 || '0.00' }}
							</template>
						</el-table-column>
						<el-table-column prop="lotteryAmount" :label="$t('report.sales.salesDraw')">
							<template #default="scope">
								{{ scope.row.lotteryAmount * 1 || '0.00' }}
							</template>
						</el-table-column>
						<el-table-column prop="totalRefundAmount" :label="$t('order.payment.refundAmount')">
							<template #default="scope">
								{{ scope.row.totalRefundAmount * 1 || '0.00' }}
							</template>
						</el-table-column>
						<el-table-column prop="totalSalePrice" :label="$t('report.sales.actual')">
							<template #default="scope">
								{{ scope.row.totalSalePrice * 1 || '0.00' }}
							</template>
						</el-table-column>
						<el-table-column prop="totalSaleQuantity" :label="$t('report.sales.actualVolume')">
							<template #default="scope">
								{{ scope.row.totalSaleQuantity * 1 || '0' }}
							</template>
						</el-table-column>
						<el-table-column prop="order_num" :label="$t('order.consume.ordersNum')">
							<template #default="scope">
								{{ scope.row.order_num * 1 || '0' }}
							</template>
						</el-table-column>
						<el-table-column prop="totalDiscountPrice" :label="$t('home.discountAmount')">
							<template #default="scope">
								{{ scope.row.totalDiscountPrice * 1 || '0.00' }}
							</template>
						</el-table-column>
						<el-table-column prop="giftQuantity" :label="$t('report.sales.gifts')">
							<template #default="scope">
								{{ scope.row.giftQuantity * 1 || '0' }}
							</template>
						</el-table-column>
					</el-table>
					<PageNum :total="data.total" :page="data.salesinfo" @exposeData="current" @fraction="fraction" />
				</div>
			</div>
		</div>
		<exports :dialogVisible="dialogExport" @close="dialogExport = false" />
	</div>
</template>

<script lang="ts" setup>
import { useI18n } from 'vue-i18n'
const { t: $t } = useI18n()
import TopInfo from '@/components/TopInfo/index.vue';
import Search from '@/components/Search/index.vue';
import PageNum from '@/components/PageNum/index.vue';
import salestop from '../common/sales_top.vue';
import getPlevel from '@/utils/level'
import { getordersReport, getordersReportList, exportordersReport } from '@/api/report';
import { useRoute } from "vue-router";
import { onMounted } from "vue";
import { ElMessage, ElMessageBox } from "element-plus";
import exports from '@/components/export.vue';
import { getgroupList } from '@/api/machine_type';
const dialogExport = ref(false)
const route = useRoute()
let data = reactive({
	status_top: false, // 头部信息加载
	mtloading: false, // 加载
	lookup: [ // 筛选栏
		{ title: $t('machine.code'), type: 'mId', value: '', key: 'm_id' },
		{ title: $t('public.date'), type: 'time', value: [], key: 'create_date' },
		{ title: $t('report.sales.statistica'), type: 'define', select: [{ label: $t('public.sun'), value: 'day' }, { label: $t('public.moon'), value: 'month' }, { label: $t('mock.year'), value: 'year' }], value: '', key: 'group' },
		{ title: $t('machine.group'), type: 'linkages', select: [], props: {}, value: '', key: 'machine_group_id', strictly: true }
	],
	list: [], // 列表信息
	info: {}, // 头部信息
	listtime: '', // 列表最后更新时间
	salesinfo: { // 筛选数据
		group: '',
		m_id: '',
		create_date: '',
		order: '',
		page: 1,
		pageNum: 15
	},
	total: 0, // 总条数
	dates: []
})
// 设备分组列表
const propsss = reactive(
	{
		checkStrictly: true,
		lazy: true,
		async lazyLoad(node: any, resolve: any) {
			const { level, value } = node
			let nodes = await getgroupList({ pid: value });
			if (nodes.state == 100 || nodes.state == 300) {
				resolve([]);
			}
			const nodesa = nodes.data.map((item) => ({
				value: item.mg_id,
				label: item.mg_id + '-' + item.mg_name
			}))
			resolve(nodesa);
		}
	}
)
data.lookup[3].props = propsss
onMounted(() => {
	if (route.query && route.query.start) {
		data.dates[0] = route.query.start
		data.dates[1] = route.query.end
		data.lookup[1].value = data.dates
		let create_date = ''
		if (route.query.start) {
			create_date = route.query.start + ' ' + '00:00:00' + '~' + route.query.end + ' ' + '23:59:59'
		}
		getlist(create_date)
		gettopinfo(create_date)
	}
})
// 获取头部信息
let gettopinfo = (e) => {
	if (e) {
		data.salesinfo.create_date = e
	}
	let info = {
		m_id: data.salesinfo.m_id,
		create_date: data.salesinfo.create_date,
		group: data.salesinfo.group
	}
	data.status_top = true
	getordersReport(info).then(res => {
		data.status_top = false
		if (res.state == 200) {
			data.info = res.data
			data.info.time = new Date().getTime()
		}
	})

}
// 获取列表信息
let getlist = (e) => {
	if (e) {
		data.salesinfo.create_date = e
	}
	data.mtloading = true
	getordersReportList(data.salesinfo).then(res => {
		data.mtloading = false
		if (res.state == 200) {
			data.listtime = new Date().getTime()
			data.list = res.data.data
			data.total = res.data.total
		}
	})
}
// 查询回调
let inves = (e) => {
	data.salesinfo.create_date = ''
	if (e.create_date != '') {
		data.salesinfo.create_date = e.create_date[0] + '~' + e.create_date[1]
	}
	data.salesinfo.group = e.group
	data.salesinfo.m_id = e.m_id
	data.salesinfo.machine_group_id = e.machine_group_id[e.machine_group_id.length - 1]
	data.salesinfo.page = 1
	data.salesinfo.pageNum = 15
	getlist('')
	gettopinfo('')
}
// 导出
let getspread = () => {
	let obj = {
		m_id: data.salesinfo.m_id,
		create_date: data.salesinfo.create_date,
		group: data.salesinfo.group
	}
	ElMessageBox.confirm($t('message.isExport')).then(res => {
		exportordersReport(obj).then(res => {
			if (res.state == 200) {
				dialogExport.value = true
				return
			}
			ElMessage({
				message: $t('message.networkFailed'),
				type: 'error'
			})
		}).catch(err => {
			console.log(err)
		})
	}).catch(err => {
		console.log('取消')
	})
}
// 页数回调
let current = (e) => {
	data.salesinfo.page = e
	getlist('')
}
// 条数回调
let fraction = (e) => {
	data.salesinfo.pageNum = e
	getlist('')
}
gettopinfo('')
getlist('')
</script>
